<template lang="html">
     <div>
        asdasd
          <div class="left">
          {{project}}
   
      </div>
     </div>
</template>

<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
  // 验证路由参数有效性-动态路由直接使用此方法获取
  validate({ params, query }) {
    console.log(params, query)
    return true // 如果参数有效
    return false // 参数无效，Nuxt.js 停止渲染当前页面并显示错误页面
  },

  // 使用 layout 属性来为页面指定使用哪一个布局文件
  // layout: 'blog',
  //  可以指定布局
  name: 'IndexPage',

  // 中间件  
  middleware(){
        console.log('中间件')
  },
  //另外的写法 middleware:'auth'

  // scrollToTop 属性用于控制页面渲染前是否滚动至页面顶部
  scrollToTop: true, 

  // 页面过度动画
  // 可以是字符
  transition: '',
  // 或对象
  // transition: {}
  // 或函数
  // transition (to, from) {}

  
  // 页面钩子
    data() {
    return { project: 'default',title:'index' }
    },

     key(route) {
        console.log(route.fullPath)
        return route.fullPath
      },

    // 异步数据 最后会与data合并
    asyncData(context) {
      return { project: 'nuxt' }
    },

    fetch({ store, params }){
      console.log(fetch)
    },

    // 在此页面下的头部信息
     head() {
      return {
        title: 'index',
        meta: [
          {
            hid: 'description',
            name: 'description',
            content: 'My custom description'
          }
        ]
      }
    },
    // watchQuer 比较耗费性能，系统默认关闭
  
})
</script>
